<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>七牛上传测试</title>
</head>
<body>
<form method="post" enctype="multipart/form-data">
    <input id='key' name="key" type="hidden" value="">
    <input id='token' name="token" type="hidden" value="">
    <input id="file" name="file" type="file" />
    <button type="submit">上传</button>
</form>

</body>

<script>
    $(document).ready(function() {
//        获取上传的地方token
        $.ajax({
            url: 'http://www.youthtech.com.cn/php-sdk-master/examples/upload_token_book.php',
            type: "post",
            success: function (e) {
                e = JSON.parse(e)
                $('#token').val(e.uptoken)
            },
            fail: function (e) {
                console.log('fail:', e)
            }
        })
    })

    $('form').submit(function(e){
        e.preventDefault()
        var fileType = $('#file').val().split('.')[1];
        var date = new Date()
//        存储
        var key = `bookIMG/${date.getFullYear()}/${date.getMonth()+1}/${date.getDate()}/${date.getTime()}.${fileType}`
        $('#key').val(key)
        var formData = new FormData(e.target);
        $.ajax({
            url: 'http://upload-z2.qiniup.com',
            data: formData,
            type: "post",
            processData: false, //让jquery不处理数据
            contentType: false, //设置false后浏览器自动识别数据类型
            success: function (e) {
                console.log('success:', e)
            },
            fail: function (e) {
                console.log('fail:', e)
            }
        })
    })

</script>
</html>